<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="ctx" th:content="${#httpServletRequest.getContextPath()}"/>
    <title>终端详情</title>
    <link rel="stylesheet" th:href="@{/css/admin/base-v2.css}">
    <link rel="stylesheet" th:href="@{/lib/font-awesome/4.7.0/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/css/admin/app.css}">
    <style>
        .page-terminal-detail .upload-close {
            display: none;
        }

        .page-terminal-detail .upload-tips {
            display: none;
        }

        .page-terminal-detail .input-opacity {
            display: none;
        }

        .page-edit .upload-close {
            display: block;
        }

        .page-edit .upload-tips {
            display: block;
        }

        .page-edit .input-opacity {
            display: block;
        }

        .upload-list-image .upload-item .upload-close {
            position: absolute;
            right: 10px;
            top: 10px;
        }

        .disable {
            background-color: #EEEEEE;
        }
    </style>
</head>

<body>
<div class="page-terminal-detail app-page">
    <div class="app-page-content">
        <div class="app-card">
            <div class="app-card-head">
                <div class="border"></div>
                <div class="app-card-title">终端详细信息</div>
            </div>
            <div class="app-card-body">
                <div class="app-card-body-con">

                    <!-- <div class="z-btn-group">
                        <button class="j-btn-control z-btn z-default edit">编辑</button>
                        <button class="j-btn-control z-btn z-default save" disabled>保存</button>
                        1详情，2编辑
                        <input type="hidden" id="opt-type" value="1"/>
                        <input type="hidden" id="deviceId" th:value="${device.deviceId}"/>
                    </div> -->

                    <div class="info-con">
                        <div class="info-item">
                            <div class="label">机器码</div>
                            <div class="info-val" id="machineNumber" th:text="${device.machineNumber}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">创建时间</div>
                            <div class="info-val" th:text="${device.addTime}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">在线状态</div>
                            <div class="info-val" th:text="${device.onlineStatusName}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">最近访问时间</div>
                            <div class="info-val" id="lastReportTime" th:text="${device.lastReportTime}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">设备mac</div>
                            <div class="info-val" id="deviceMac" th:text="${device.deviceMac}"></div>
                        </div>
                        <div class="info-item" data-type="deviceModel">
                            <div class="label">机型</div>
                            <div class="info-val" th:text="${device.deviceModel}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">设备ip</div>
                            <div class="info-val" th:text="${device.deviceIp}"></div>
                        </div>
                        <div class="info-item editable" data-type="province_select">
                            <div class="label">省份</div>
                            <div class="info-val" th:text="${device.province}"></div>
                        </div>
                        <div class="info-item editable" data-type="city_select">
                            <div class="label">城市</div>
                            <div class="info-val" th:text="${device.city}"></div>
                        </div>
                        <div class="info-item editable" data-type="area_select">
                            <div class="label">区/县</div>
                            <div class="info-val" th:text="${device.district}"></div>
                        </div>
                        <div class="info-item editable" data-type="detailAddr">
                            <div class="label">详细地址</div>
                            <div class="info-val" th:text="${device.detailAddress}"></div>
                        </div>
                        <div class="info-item editable" data-type="propertyName">
                            <div class="label">小区名称</div>
                            <div class="info-val" th:text="${device.propertyName}"></div>
                        </div>
                        <div class="info-item editable" data-type="buildingName">
                            <div class="label">楼栋名</div>
                            <div class="info-val" th:text="${device.buildingName}"></div>
                        </div>
                        <div class="info-item editable" data-type="unitName">
                            <div class="label">单元名</div>
                            <div class="info-val" th:text="${device.unitName}"></div>
                        </div>
                        <div class="info-item editable" data-type="administrator">
                            <div class="label">管理人</div>
                            <div class="info-val" th:text="${device.administratorName}"
                                 style=" display: flex; align-items: center; "></div>
                            <div class="info-id" th:text="${device.administrator}"
                                 style=" display: none; align-items: center; "></div>
                        </div>
                        <div class="info-item editable" data-type="deviceStatus">
                            <div class="label">设备状态</div>
                            <div class="info-val" th:text="${device.deviceStatusName}"></div>
                        </div>
                        <div class="info-item editable" data-type="breakdownType">
                            <div class="label">故障类型</div>
                            <div class="info-val" th:text="${device.breakdownName}"></div>
                        </div>
                        <div class="info-item" data-type="breakdownImg">
                            <div class="label">故障图片</div>
                            <div class="error-image info-val">
                                <div class="upload upload-image" data-input-name="image" data-limit="0"
                                     th:attr="data-url=@{/breakdownImg/upload(deviceId=${device.deviceId})}"
                                     data-fieldname="files"
                                     data-upload-success="uploadSuccess">
                                    <!-- 上传结果 -->
                                    <div class="upload-list upload-list-image"
                                         th:if="${breakdownImgList == null || breakdownImgList.size() == 0}">

                                    </div>
                                    <div class="upload-list upload-list-image"
                                         th:if="${breakdownImgList != null && breakdownImgList.size() > 0}">
                                        <a class="upload-item"
                                           th:each="img:${breakdownImgList}"
                                           th:href="${img.imgUrl}"
                                           target="_blank">
                                            <img th:src="${img.imgUrl}">
                                            <div class="input z-mab z-hide" th:text="${img.breakdownImgId}"></div>
                                            <div class="upload-close fa fa-close">
                                                <input type="hidden" name="image"
                                                       th:value="${img.imgUrl}">
                                                <input type="hidden" name="breakdownImgId"
                                                       th:value="${img.breakdownImgId}">
                                            </div>
                                        </a>
                                    </div>
                                    <div class="upload-module">
                                        <div class="upload-tips">只能上传jpg/png文件</div>
                                        <div class="upload-error"></div>
                                        <div class="upload-loading">
                                            <i class="fa fa-cog fa-spin"></i> 图片上传中...
                                        </div>
                                        <div class="input-opacity">
                                            <input type="file" class="input"
                                                   accept="image/gif,image/jpeg,image/jpg,image/png">
                                            <a class="z-btn z-default"><i class="fa fa-upload"></i> 上传</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="info-item editable" data-type="remark">
                            <div class="label">备注</div>
                            <div class="info-val" th:text="${device.remark}"></div>
                        </div>
                    </div>
                </div>

            </div>
        </div>

        <div class="app-card">
            <div class="app-card-head">
                <div class="border"></div>
                <div class="app-card-title z-flex">SIM卡信息</div>
                <div id="sim-status-btn" class="z-btn z-primary z-fr z-hide"
                     th:attr="data-sim-status=${deviceSimInfo.simStatus},data-device-code=${deviceSimInfo.deviceCode}"
                     th:text="${deviceSimInfo.simStatus == 0?'关停':'启用'}"></div>
                <input id="sim-status" type="hidden" th:value="${deviceSimInfo.simStatus}"/>
                <input id="sim-msisdn" type="hidden" th:value="${deviceSimInfo.msisdn}"/>
            </div>
            <div class="app-card-body">
                <div class="app-card-body-con">
                    <div class="info-con">
                        <div class="info-item">
                            <div class="label">sim卡是否在位</div>
                            <div class="info-val" th:text="${deviceSimInfo.simIsInPlace}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">sim卡ICCID</div>
                            <div class="info-val" th:text="${deviceSimInfo.simIccid}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">sim卡IMSI</div>
                            <div class="info-val" th:text="${deviceSimInfo.simImsi}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">激活时间</div>
                            <div class="info-val" th:text="${deviceSimInfo.activationTime}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">信号强度</div>
                            <div class="info-val" th:text="${deviceSimInfo.singnalStrength}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">当月流量预警（MB）</div>
                            <div class="info-val" th:text="${deviceSimInfo.currentMonthTraffic}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">历史总流量（MB）</div>
                            <div class="info-val" th:text="${deviceSimInfo.historicalTotalTraffic}"></div>
                        </div>
                        <!-- 测速相关 -->
                         <div class="info-item">
                            <div class="label">上行速率（Mbps）</div>
                            <div class="info-val" th:text="${deviceSimInfo.upStreamSpeed}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">下行速率（Mbps）</div>
                            <div class="info-val" th:text="${deviceSimInfo.downStreamSpeed}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">测速更新时间</div>
                            <div class="info-val" th:text="${deviceSimInfo.testSpeedUpdateTime}"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="app-card">
            <div class="app-card-head">
                <div class="border"></div>
                <div class="app-card-title">版本信息</div>
            </div>
            <div class="app-card-body">
                <div class="app-card-body-con">
                    <div class="info-con">
                        <div class="info-item">
                            <div class="label">mips版本</div>
                            <div class="info-val" th:text="${device.softwareVersion}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">mips升级时间</div>
                            <div class="info-val" th:text="${device.softwareUpgradeTime}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">固件版本</div>
                            <div class="info-val" th:text="${device.firmwareVersion}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">固件升级时间</div>
                            <div class="info-val" th:text="${device.firmwareUpgradeTime}"></div>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <div class="app-card">
            <div class="app-card-head">
                <div class="border"></div>
                <div class="app-card-title">策略信息</div>
            </div>
            <div class="app-card-body">
                <div class="app-card-body-con">
                    <div class="info-con">
                        <div class="info-item">
                            <div class="label">开机时间</div>
                            <div class="info-val" th:text="${device.timeBoot}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">关机时间</div>
                            <div class="info-val" th:text="${device.timeShutdown}"></div>
                        </div>
                        <div class="info-item">
                            <div class="label">音量</div>
                            <div class="info-val" th:text="${device.deviceVolume}"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="popup-default z-popup z-fixed z-df z-flex-cc z-hide">
        <div class="bg" data-popup-close></div>
        <!-- 管理授权 -->
        <div class="popup-device-authority section z-hide">
            <div class="title">管理授权</div>
            <div class="content">
                <form>
                    <div class="form-item row">
                        <div class="label">
                            <label>可选用户</label>
                        </div>
                        <div class="users body">
                        </div>
                    </div>
                    <div class="z-btn-group" style="margin-top:30px">
                        <a class="z-btn z-primary" onclick="deviceAuthority()">确定</a>
                        <a class="z-btn z-default" data-popup-close>取消</a>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</div>
</div>

<script th:src="@{/lib/jquery.min.js}"></script>
<script th:src="@{/lib/layer-v3.1.1/layer/layer.js}"></script>
<script th:src="@{/js/form.js}"></script>
<script th:src="@{/js/popup.js}"></script>
<script th:src="@{/js/admin-upload.js}"></script>
<script th:src="@{/js/admin/app.js}"></script>
<script th:src="@{/js/address-0.0.3.js}"></script>

<script>
    var context = $("meta[name='ctx']").attr("content");
    var deviceStatusList = [
        {'id': 0, 'name': '可售'},
        {'id': 1, 'name': '预拆除'},
        {'id': 2, 'name': '维护'}
    ];
    // $('.input-opacity').hide();
    // $('.upload-tips').hide();

    function isBlank(val) {
        if (val == null) {
            return true;
        }
        if (val == '') {
            return true;
        }
        if (val == undefined) {
            return true;
        }
        if (val == 'undefined') {
            return true;
        }
        return false;
    }

    $('.edit').click(function () {
        $('.edit').attr("disabled", 'disabled');
        $('.save').removeAttr("disabled");
        $('.page-terminal-detail').addClass('page-edit');
        $('#sim-status-btn').removeClass('z-hide');
        var optType = $('#opt-type').val();

        var $infoCon = $(this).parents('.app-card-body-con').eq(0).find('.info-con');

        if (optType == '1') {
            // $('.input-opacity').show();
            // $('.upload-tips').show();
            $('#opt-type').val('2');
            var $infoVals = $infoCon.find('.editable');
            var province = '';
            var city = '';
            var area = '';
            var deviceStatusName;
            $infoVals.each(function (val, index) {
                var editType = $(this).data('type');
                if (editType == 'province_select') {
                    province = $(this).find('.info-val').html();
                    // var inputHtml = '<select id="province" class="select-province"><option value="">请选择</option></select>';
                    // $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'city_select') {
                    city = $(this).find('.info-val').html();
                    // var inputHtml = '<select id="city" class="select-city"><option value="">请选择</option></select>';
                    // $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'area_select') {
                    area = $(this).find('.info-val').html();
                    var inputHtml = '<select id="area" class="select-district"><option value="">请选择</option></select>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'detailAddr') {
                    //详细地址
                    var inputHtml = '<input type="text" id="detailAddr"  data-rule="required" value="' + $(this).find('.info-val').html() + '"/>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'deviceModel') {
                    //机型
                    var deviceModelSelectList = getDeviceModelSelectList();
                    if (deviceModelSelectList && deviceModelSelectList.length > 0) {
                        var deviceModel = $(this).find('.info-val').html();
                        var options = '<option value="">请选择</option>';
                        for (var i = 0; i < deviceModelSelectList.length; i++) {
                            if (deviceModel == deviceModelSelectList[i].deviceModel) {
                                options += '<option selected="selected" value="' + deviceModelSelectList[i].deviceModel + '">' + deviceModelSelectList[i].deviceModel + '</option>';
                            } else {
                                options += '<option value="' + deviceModelSelectList[i].deviceModel + '">' + deviceModelSelectList[i].deviceModel + '</option>';
                            }
                        }
                        var inputHtml = '<select id="deviceModel" data-rule="required">' + options + '</select>';
                        $(this).find('.info-val').html(inputHtml);
                    }
                } else if (editType == 'propertyName') {
                    //物业名称
                    var inputHtml = '<input type="text" id="propertyName" data-rule="required" value="' + $(this).find('.info-val').html() + '"/>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'buildingName') {
                    //楼栋名称
                    var inputHtml = '<input type="text" id="buildingName" data-rule="required" value="' + $(this).find('.info-val').html() + '"/>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'unitName') {
                    //单元名称
                    var inputHtml = '<input type="text" id="unitName" data-rule="required" value="' + $(this).find('.info-val').html() + '"/>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'administrator') {
                    //管理人
                    var inputHtml = '<input type="text" id="administratorNames" data-rule="required" value="' + $(this).find('.info-val').html() + '" disabled/>' +
                        '<input type="hidden" id="administrator" data-rule="required" value="' + $(this).find('.info-id').html() + '"/>' +
                        '<a onclick="openAdministratorSelector()" class="z-btn z-primary" style=" height: 28px; line-height: 28px; margin-left: 10px; ">选择</a>';
                    $(this).find('.info-val').html(inputHtml)
                } else if (editType == 'deviceStatus') {
                    //设备状态
                    //（0:可售  1:预拆除  2:维护）
                    deviceStatusName = $(this).find('.info-val').html();
                    var options = '<option value="">请选择</option>';
                    for (var i = 0; i < deviceStatusList.length; i++) {
                        if (deviceStatusName == deviceStatusList[i].name) {
                            options += '<option selected="selected" value="' + deviceStatusList[i].id + '">' + deviceStatusList[i].name + '</option>';
                        } else {
                            options += '<option value="' + deviceStatusList[i].id + '">' + deviceStatusList[i].name + '</option>';
                        }
                    }
                    var inputHtml = '<select id="deviceStatus" data-rule="required">' + options + '</select>';
                    $(this).find('.info-val').html(inputHtml);
                    /*
                     * 添加点击事件
                     *1.设备状态改为维护的时候，才可以操作故障类型和故障图片
                     *2.设备状态改为预拆除和可售的时候，故障类型的值清空
                     */
                    $("#deviceStatus").change(function () {
                        var deviceStatus = $("#deviceStatus").val();
                        if (deviceStatus == 0 || deviceStatus == 1  || isBlank(deviceStatus)) {
                            //预拆除和可售,故障类型的值清空
                            $('#breakdownType').val(-1);
                            $('#breakdownType').attr("disabled", 'disabled');
                            $('.upload-module').hide();
                        } else if (deviceStatus == 2) {
                            //维护
                            $('#breakdownType').removeAttr("disabled");
                            $('.upload-module').show();
                        }
                    });
                    if (deviceStatusName == '预拆除' || deviceStatusName == '可售' || isBlank(deviceStatusName)) {
                        $('.upload-module').hide();
                    }
                } else if (editType == 'breakdownType') {
                    //故障类型
                    var breakdownTypeSelectList = getBreakdownTypeSelectList();
                    var breakdownName = $(this).find('.info-val').html();
                    //默认-1，表示无任何状态
                    var options = '<option value="-1">请选择</option>';
                    for (var i = 0; i < breakdownTypeSelectList.length; i++) {
                        if (breakdownName == breakdownTypeSelectList[i].breakdownName) {
                            options += '<option selected="selected" value="' + breakdownTypeSelectList[i].breakdownType + '">' + breakdownTypeSelectList[i].breakdownName + '</option>';
                        } else {
                            options += '<option value="' + breakdownTypeSelectList[i].breakdownType + '">' + breakdownTypeSelectList[i].breakdownName + '</option>';
                        }
                    }
                    var inputHtml = '<select id="breakdownType">' + options + '</select>';
                    $(this).find('.info-val').html(inputHtml);
                    if (deviceStatusName == '预拆除' || deviceStatusName == '可售' || isBlank(deviceStatusName)) {
                        //预拆除和可售,故障类型的值清空
                        $('#breakdownType').val(-1);
                        $('#breakdownType').attr("disabled", 'disabled');
                        $('.input-opacity').attr("disabled", 'disabled');
                    } else if (deviceStatus == '维护') {
                        //维护
                        $('#breakdownType').removeAttr("disabled");
                        $('.input-opacity').removeAttr("disabled");
                    }
                } else if (editType == 'remark') {
                    //备注
                    var inputHtml = '<input type="text" id="remark" value="' + $(this).find('.info-val').html() + '"/>';
                    $(this).find('.info-val').html(inputHtml)
                }

            })

        }
        // 省市区
        $(".info-con").address({
            provinceText: '选择省',
            cityText: '选择市',
            districtText: '选择区',
            apiUrl: context + "/area/list",
            // 默认值
            defaultProvince: province,
            defaultCity: city,
            defaultDistrict: area
        });
    })

    $('.save').click(function () {

        var deviceId = $("#deviceId").val();
        var province = $("#province").val();
        var city = $("#city").val();
        var area = $("#area").val();
        var detailAddr = $("#detailAddr").val();
        var propertyName = $("#propertyName").val();
        var buildingName = $("#buildingName").val();
        var unitName = $("#unitName").val();
        var administrator = $("#administrator").val();
        var deviceStatus = $("#deviceStatus").val();
        var breakdownType = $("#breakdownType").val();
        var remark = $("#remark").val();
        var machineNumber = $("#machineNumber").text();

        var deviceDetail = {
            'deviceId': deviceId,
            'province': province,
            'city': city,
            'district': area,
            'detailAddress': detailAddr,
            'propertyName': propertyName,
            'buildingName': buildingName,
            'unitName': unitName,
            'administrator': administrator,
            'deviceStatus': deviceStatus,
            'breakdownType': breakdownType,
            'remark': remark,
            'machineNumber': machineNumber
        };

        App.ajax({
            type: "POST",
            url: context + "/deviceInfo/detail/update",
            data: JSON.stringify(deviceDetail),
            dataType: "json",
            contentType: 'application/json;charset=utf-8', //设置请求头信息
            success: function (result) {
                if (result.code == 0) {
                    $('.page-terminal-detail').removeClass('page-edit');
                    $('#opt-type').val('1');
                    $('.edit').removeAttr("disabled");
                    var $infoVals = $(this).parents('.app-card-body-con').eq(0).find('.info-con').find('input[type=text]');
                    $infoVals.each(function () {
                        $(this).parent('.info-val').html($(this).val());
                    })
                    window.location.href = context + "/deviceInfo/deviceDetail/" + deviceId;
                } else {
                    popup.tipsTop(result.msg, 'warning');
                }
            },
            error: function () {
                popup.tipsTop('系统异常，请稍候再试', 'error');
            }
        });
    })

    /**
     * 获取机型下拉集合
     */
    function getDeviceModelSelectList() {
        var deviceModelSelectList = [];
        App.ajax({
            type: "POST",
            url: context + "/deviceModel/getDeviceModelSelectList",
            dataType: "json",
            async: false,
            success: function (result) {
                if (result.code == 0) {
                    deviceModelSelectList = result.data;
                }
            },
            error: function () {
                popup.tipsTop('系统异常，请稍候再试', 'error');
            }
        });
        return deviceModelSelectList;
    }


    /**
     * 获取终端故障类型下拉集合
     */
    function getBreakdownTypeSelectList() {
        var breakdwonTypeSelectList = [];
        App.ajax({
            type: "POST",
            url: context + "/breakdownType/selectList",
            dataType: "json",
            async: false,
            success: function (result) {
                if (result.code == 0) {
                    breakdwonTypeSelectList = result.data;
                }
            },
            error: function () {
                popup.tipsTop('系统异常，请稍候再试', 'error');
            }
        });
        return breakdwonTypeSelectList;
    }

    //删除故障图片
    $(document).on('click', '.upload-item .upload-close', function (e) {
        e.preventDefault();

        var id = $(this).parents('.upload-item').find('input[name=breakdownImgId]').val();
        if (null == id || id == '' || id == undefined) {
            popup.tipsTop('故障图片ID不能为空', 'warning');
            return;
        }
        var flag = false;
        App.ajax({
            type: "POST",
            url: context + "/breakdownImg/delete/" + id,
            dataType: "json",
            async: false,
            success: function (result) {
                if (result.code == 0) {
                    popup.tipsTop(result.msg, 'success');
                    flag = true;
                    if (flag) {
                        $(this).parents('.upload-item').remove();
                    }
                } else {
                    popup.tipsTop(result.msg, 'warning');
                }
            },
            error: function () {
                popup.tipsTop('系统异常，请稍候再试', 'error');
            }
        });
        if (flag) {
            $(this).parents('.upload-item').remove();
        }
    })

    $('#sim-status-btn').click(function () {
        var simStatus = $('#sim-status').val();
        var simMsisdn = $('#sim-msisdn').val();
        var deviceCode = $(this).attr('data-device-code');
        var btnName = '';
        var confirmMsg = '';
        if (simStatus == '0') {
            //关停
            simStatus = '1';
            btnName = '启用';
            confirmMsg = "关停";
        } else {
            //启用
            simStatus = '0';
            btnName = '关停';
            confirmMsg = "启用";
        }
        if (confirm("是否" + confirmMsg + "SIM卡")) {
            App.ajax({
                type: 'post',
                dataType: 'json',
                url: context + '/deviceInfo/setSimStatus',
                data: {
                    deviceCodes: deviceCode,
                    simStatus: simStatus
                },
                cache: false,
                async: true,
                success: function (data) {
                    console.log(data);
                    if (data.code == 0) {
                        popup.tipsTop(data.msg, 'success');
                        $('#sim-status-btn').text(btnName);
                        $('#sim-status').val(simStatus);
                    } else {
                        popup.tipsTop(data.msg, 'warning');
                    }
                },
                error: function () {
                    popup.tipsTop('系统异常，请稍候再试', 'error');
                }
            })
        }
    })

    /**
     * 上传故障图片回调
     * @param data
     */
    function uploadSuccess(data) {

        setTimeout(function () {
            $('.upload-item').each(function (index) {

                if (index == $('.upload-item').length - 1) {
                    $(this).find('.input').append('<input type="hidden" name="breakdownImgId" value="' + data[0].breakdownImgId + '">');
                    $(this).find('.close').removeClass('close').addClass('upload-close');
                }
            })
        }, 200)
    }

    // 授权管理 - 弹窗打开
    function openAdministratorSelector() {
        console.log('openAdministratorSelector');
        App.ajax({
            type: "POST",
            url: context + "/deviceInfo/getDeviceAuthorityUsersList",
            success: function (obj) {
                var code = obj.code;
                if (code == 0) {
                    var administrator = $("#administrator").val();
                    var administratorIdArr = [];
                    if(!isBlank(administrator)){
                        administratorIdArr = administrator.split(",");
                    }
                    var data = obj.data;
                    var html = [];
                    for (var i = 0; i < data.length; i++) {
                        var item = data[i];

                        var index = administratorIdArr.indexOf(''+item.userId);
                        if(index >= 0){
                            html.push('<label style="margin-right:10px;"><input class="input" type="checkbox" checked="checked" name="users" value="' + item.userId + '"> ' + item.realname + '</label>');
                        } else {
                            html.push('<label style="margin-right:10px;"><input class="input" type="checkbox" name="users" value="' + item.userId + '"> ' + item.realname + '</label>');
                        }

                    }
                    $('.users').html(html.join(''))
                }
            }
        })
        // // 表单复制
        // $(".popup-device-authority").formLoad({
        //     deviceCodes: deviceCode
        // });
        popup.open(".popup-device-authority")
    }

    /**
     * 管理授权
     */
    function deviceAuthority() {
        var ids = '';
        var names = '';
        $('.users label').each(function () {
            if ($(this).find('input')[0].checked) {
                var id = $(this).find('input').val();
                var name = $(this).text();
                ids += ',' + id;
                names += ',' + name;
            }
        })
        if (!isBlank(names)) {
            names = names.substring(1);
        }
        if (!isBlank(ids)) {
            ids = ids.substring(1);
        }
        $('#administratorNames').val(names);
        $('#administrator').val(ids);
        popup.close(".popup-device-authority")

    }
</script>
<script th:src="@{/lib/flatpickr/flatpickr.js}"></script>
<script th:src="@{/lib/flatpickr/zh.js}"></script>
</body>

</html>